<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="../common/jsptag.jsp"%>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="keywords" content="${systemParamMap["sitekey"].paramValue}" />
    <meta name="description" content="${systemParamMap["sitedesc"].paramValue}" />
    <meta name="author" content="${systemParamMap["siteauthor"].paramValue}" />
    <title>求片留言</title>
    <link href="<%=request.getContextPath() %>/css/main.css" rel="stylesheet" type="text/css" />
    <link rel="ShortcutIcon" href="favicon.ico" type="image/x-icon" />
    <link rel="Bookmark" href="favicon.ico" />
    <script src="<%=request.getContextPath() %>/js/jquery-1.7.1.min.js"></script>
    <script src="<%=request.getContextPath() %>/js/common.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function(){
            $("#imageCode").css("display", "none");
            $(".input_text_normal").bind("focus keydown", function() {
                if (event.type == 'focus') { toggleImageCode(); }
                if (event.type == 'keydown') {
                    if (event.keyCode == 13) { submitLeaveMessage(); }
                }
            });
        });

        function toggleImageCode() {
            $("#imageCode").attr("alt", "验证码");
            $("#imageCode").attr("src", "/verifyCode?random="+Math.random());
            $("#imageCode").css("display", "inline");
            $("#imageCode").css("cursor", "hand");
            $("#imageCode").bind("click", function() {
                $(this).attr("alt", "验证码");
                $(this).attr("src", "/verifyCode?random="+Math.random());
            });
        }

        function submitLeaveMessage(){
            if ($("#commentsmessage").val() == null || $("#commentsmessage").val() == "") {
                alert('留言内容不能为空！');
                return;
            }

            if ($("#commentsmessage").val().length > 200) {
                alert('留言内容不能大于200个字符！');
                return;
            }

            var form = createForm("submitLeaveMessage.html");
            createInput("commentsmessage", $("#commentsmessage").val(), form);
            createInput("currentPage", '${pageCount.currentPage}', form);
            createInput("imageCode", $(".input_text_normal").val(), form);
            submitForm(form);
        }
    </script>
</head>
<body>
    <div id="main">
			
        <jsp:include page="../header.jsp"></jsp:include>
	
		<div class="height1">&nbsp;</div>
	
		<div class="nav_box mb10">
            <div class="nav_box2_t">
                <div class="nav2_t_m">
                   <div class="nav_title1">
                       <span class="fl"><font class="fot2">求片留言</font></span>
                       <span class="sp_tip">总留言 ${messageCount}</span>
                   </div>
                </div>
                <div class="nav2_t_l"></div>
                <div class="nav2_t_r"></div>
            </div>

            <div class="column_content">
                <div id="commentsNew">
                    <div class="comments_message_txtarea">
                        <textarea class="textarea_normal" id="commentsmessage" name="commentsmessage"></textarea>
                    </div>
                    <div class="h30">
                        <ul class="horilist_ul">
                            <li class="horilist_name">验证码:</li>
                            <li class="horilist_compo">
                                <input type="text" class="input_text_normal" size="5" name="imageCode">
                            </li>
                            <li class="horilist_name"><img id="imageCode" width="60" height="21"/></li>
                            <!-- <li class="horilist_name"><input type="checkbox">匿名</li> -->
                            <li class="fr">留言内容小于200个字符</li>
                        </ul>
                        <div class="nofloat"></div>
                    </div>

                    <div class="h25">
                        <ul class="btn_nomal" onclick="javascript:submitLeaveMessage();" onmouseout="this.className='btn_nomal'" onmouseover="this.className = 'btn_over'">
                            <li class="btn_l"></li><li class="btn_m">提交</li><li class="btn_r"></li>
                        </ul>
                        <div class="nofloat"></div>
                    </div>
                </div>
            </div>
                   
            <div class="detail_com">
                       
                <ul class="conment_nav1">
                    <c:forEach items="${leaveMessageList}" var="leaveMessage">
                        <li>
                            <div class="conm_img">
                                <a href="#"><img width="55" height="55" src="${leaveMessage.user.userPicture}"></a>
                            </div>
                            <div class="conm_text">
                                <div class="conm_text_t">
                                    <span>
                                        <fmt:formatDate value="${leaveMessage.createTime}" pattern="yyyy-MM-dd HH:mm:ss"/>
                                    </span>
                                    <strong>${leaveMessage.user.nickName}</strong>
                                </div>
                                <div class="conm_text_m">${leaveMessage.message}</div>
                                <div class="nofloat"></div>
                            </div>

                            <div class="nofloat"></div>
                        </li>
                    </c:forEach>
                </ul>
                           
                <div id="control">
                    <a href="javascript:location.href='listLeaveMessage.html?page=1'" class="someClass" title="跳转到首页"><<</a>
                    <c:choose>
                        <c:when test="${pageCount.currentPage == 1}">
                            <a href="javascript:void(0);" style="background-color: #808080;"><</a>
                        </c:when>
                        <c:otherwise>
                            <a href="javascript:location.href='listLeaveMessage.html?page=${pageCount.currentPage - 1}'" class="someClass" title="跳转到上一页"><</a>
                        </c:otherwise>
                    </c:choose>
                    <label>${pageCount.currentPage},${pageCount.totalPage} 页</label>
                    <c:choose>
                        <c:when test="${pageCount.currentPage == pageCount.totalPage}">
                            <a href="javascript:void(0);" style="background-color: #808080;">></a>
                        </c:when>
                        <c:otherwise>
                            <a href="javascript:location.href='listLeaveMessage.html?page=${pageCount.currentPage + 1}'" class="someClass" title="跳转到下一页">></a>
                        </c:otherwise>
                    </c:choose>
                    <a href="javascript:location.href='listLeaveMessage.html?page=${pageCount.totalPage}'" class="someClass" title="跳转到尾页">>></a>

                    <div>
                        跳转到
                        <select onchange="location.href = 'listLeaveMessage.html?page=' + this.value">
                            <c:forEach begin="1" end="${pageCount.totalPage}" varStatus="page">
                                <option value="${page.index}" <c:if test="${pageCount.currentPage == page.index}">selected</c:if>>${page.index}页</option>
                            </c:forEach>
                        </select>
                    </div>
                </div>

         </div>
	
		<jsp:include page="../footer.jsp"></jsp:include>
	
	</div>

</body>
</html>
